<template>
	<view>
		<!-- 导航 -->
		<uni-nav-bar
		 leftWidth='200rpx' rightWidth='200rpx'
		 @clickLeft="$utils.ret()" left-icon="left" leftText="返回" title="修改个人资料" height="130rpx" />
		<!-- 资料 -->
		<view class="info">
			<view class="item">
				<view class="l">
					<view class="iconfont icon-wode"></view>
					<view class="tit">头像</view>
				</view>
				<view class="r">
					<view class="logo">
						<image src="/static/8.jpg" mode=""></image>
					</view>
					<view class="iconfont icon-gengduo1"></view>
				</view>
			</view>
			<view class="item">
				<view class="l">
					<view class="iconfont icon-nicheng" style="font-size: 40rpx;"></view>
					<view class="tit">昵称</view>
				</view>
				<view class="r">
					<view class="tit">嘎哥</view>
					<view class="iconfont icon-gengduo1"></view>
				</view>
			</view>
			<view class="item">
				<view class="l">
					<view class="iconfont icon-gender" style="font-size: 40rpx;"></view>
					<view class="tit">性别</view>
				</view>
				<view class="r">
					<view class="tit">保密</view>
					<view class="iconfont icon-gengduo1"></view>
				</view>
			</view>
			<view class="item">
				<view class="l">
					<view class="iconfont icon-xiugaishoujimima"></view>
					<view class="tit">手机</view>
				</view>
				<view class="r">
					<view class="tit">12522566761</view>
					<view class="iconfont icon-gengduo1"></view>
				</view>
			</view>
		</view>
		<!-- 保存 -->
		<view class="save">
			<button @click="gos">保存</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {
           gos(){
			   uni.switchTab({
			   	url:'/pages/vip/vip'
			   })
		   }
		}
	}
</script>

<style lang="less">
	// @import url(/static/iconfont/iconfont.css);

	page {
		width: 100%;
		height: 100%;
		background-color: #f6f4f5;
	}

	// 导航

	/deep/.uni-navbar__content {
		border: none;
	}

	// 资料
	.info {
		background-color: #ffffff;
		padding-left: 20px;
		padding-right: 25rpx;

		.item {
			height: 100rpx;
			box-sizing: border-box;
			border-bottom: 2rpx solid #f7f7f7;
			display: flex;
			justify-content: space-between;

			.l {
				display: flex;
				line-height: 100rpx;
				font-size: 30rpx;

				.iconfont {
					color: #7abdfe;

				}

				.tit {
					margin-left: 20rpx;
					color: #999999;
				}
			}

			.r {
				display: flex;
				justify-content: flex-end;
				line-height: 100rpx;

				.logo {
					width: 80rpx;
					height: 80rpx;
					background-color: aqua;
					margin-right: 15rpx;
					border-radius: 50%;

					image {
						width: 80rpx;
						height: 80rpx;
					}
				}

				.tit {
					color: #a7a7a7;
					margin-right: 20rpx;
				}

				.iconfont {
					color: #bebebe;
					margin-right: 35rpx;
				}
			}
		}
	}

	// 保存
	.save {
		margin-top: 60rpx;
		height: 75rpx;

		button {
			width: 515rpx;
			border-radius: 50rpx;
			border: none;
			background-color: #1f8fff;
			color: #fff;
		}
	}
</style>